<script setup lang='ts'>
import * as echarts from 'echarts';
import { ref, onMounted } from 'vue'
defineOptions({
    name: 'Echarts'
})
const props = defineProps({
    options: {
        type: Object,
        default: () => {

        }
    },
    size: {
        type: Object,
        default: () => {
            return {
                width: '200px',
                height: '200px'
            }
        }
    }
})
const main = ref(null)

onMounted(() => {
    const myChart = echarts.init(main.value)
    myChart.setOption(props.options);
    window.addEventListener('resize', () => {
        myChart.resize()

    })
})



</script>

<template>

    <div ref="main" :style="`width:${size.width};height:${size.height};`"></div>



</template>

<style lang='scss' scoped></style>
